<!DOCTYPE html>
<html>

<head>
    <title>编辑游记</title>
    <meta charset="utf-8"/>
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <link rel="stylesheet" href="/js/bootstrap/css/bootstrap.min.css">
    <script src="/js/jquery/jquery.min.js"></script>
    <script src="/js/bootstrap/js/bootstrap.min.js"></script>
    <link rel="stylesheet" href="/css/font/css/font-awesome.min.css"/>
    <link rel="stylesheet" href="/css/reset.css"/>
    <link rel="stylesheet" href="/css/editTravels.css"/>

    <script src="/js/plugins/jrender/jrender.min.js"></script>
    <link rel="stylesheet" href="/js/plugins/dialog2/dialog.css"/>
    <script src="/js/plugins/dialog2/dialog.min.js"></script>


    <link rel="stylesheet" href="/dist/css/rolldate.css"/>
    <script src="/js/plugins/jquery-form/jquery.form.js"></script>
    <script src="/js/plugins/eleditor/Eleditor.min.js"></script>
    <script src="/js/plugins/eleditor/webuploader.min.js"></script>
    <script src="/js/plugins/My97DatePicker/WdatePicker.js"></script>
    <script src="/js/common.js"></script>
    <script src="/dist/rolldate.js"></script>
    <script>
        $(function () {
            //获取id------------------------------------------------
            //引入文件common.js中的方法,表示获得当前路径的?号之后的数据,自动包装成数组
            var params = getParams();
            var hotelId = params.id;
            var user = JSON.parse(sessionStorage.getItem('user'));


            //房型下拉框--------------------------------------------------
            $.get("/rooms/"+hotelId,function (data) {
                console.log(data);
                var op = "";
                $.each(data.list,function (index, item) {
                    op += "<option value='"+ item.id +"'>"+ item.titel +"</option>"
                });
                $("#bed").html(op);


                $(".c-select").change(function () {
                    var roomId = $("#detailForm select").val()
                    $("#detailForm input[name='id']").val(roomId)
                    $("#detailForm input[name='user.id']").val(user.id)
                    console.log(roomId);
                    console.log(hotelId)
                    $.get("/rooms/pay/"+roomId,function (data) {
                        console.log(data);
                        $("#detailForm input[name='price']").val(data.price)
                        sessionStorage.setItem('roomPrice',JSON.stringify(data.price));
                    })
                })
            });
            $("#detailForm input[name='_method']").val("put")
            $(".btn").click(function () {
                $("#detailForm").ajaxSubmit(function (data) {
                    if(data.success){
                        window.location.href="/payRMB.html"
                    }
                })
            })

            //end--------------------------------------------------------




            //-----------------------------时间插件---------------------------------------------------
            new rolldate.Date({//设置model
                el:'#date14',
                format:'YYYY-MM-DD',
                beginYear:2000,
                endYear:2100,
                theme:'blue',
                confirmBefore:function(el,date){
                    //vue.date = date;
                }
            })
            new rolldate.Date({//设置model
                el:'#date15',
                format:'YYYY-MM-DD',
                beginYear:2000,
                endYear:2100,
                theme:'blue',
                confirmBefore:function(el,date){
                    //vue.date = date;
                }
            })
            //-----------------------------end---------------------------------------------------

            //------------------------------提交表单--------------------------------------------------------




        });
    </script>



</head>

<body>
<div class="search-head">
    <div class="row nav-search">
        <div class="col-3">
            <a href="javascript:window.history.go(-1);">
                <span><i class="fa fa-times"></i></span>
            </a>
        </div>
        <div class="col-5"><span>支付</span></div>
        <div class="col" style="text-align: right;">

        </div>
    </div>
</div>
<div class="travels form-group">
    <div class="container">
        <form id="detailForm" method="post" action="/rooms">

            <input type="hidden" name="id" value=""/>
            <input type="hidden" name="user.id" value=""/>
            <input type="hidden" name="_method" value=""/>
            </br></br>
            <div id="app">
                入住日期 :<input readonly type="text"  name="checkInTime"  class="form-control" id="date14" placeholder="请选择入住日期" v-model="date"><br>
                离店日期 :<input readonly type="text"  name="checkOutTime" class="form-control" id="date15" placeholder="请选择离店日期" v-model="date">
            </div>
            <label>房间类型:</label>
            <select class="c-select form-control" name="" id="bed" render-value="person">
                <option value="-1" selected>--请选择房间类型--</option>
            </select>
            <label>房间价格:</label>
            <input type="text" name="price" class="form-control" render-value="perExpends">
            </br>
            <div class="row">
                <div class="col-4">
                </div>
                <div class="col-8">
                    <button class="btn">
                        <i class="fa fa-weixin fa-fw"></i>
                        支付
                    </button>
                </div>
            </div>
        </form>
    </div>

    <hr/>

</div>


</body>

</html>